import React from 'react'

import './style.scss'

class CityList extends React.Component{
    constructor(props, context){
        super(props, context)
    }
    render() {
        return (
            <div className='cityList clearfix'>
                <h1>热门城市</h1>
                <ul>
                    <li onClick={this.clickHandle.bind(this, '北京')}>北京</li>
                    <li onClick={this.clickHandle.bind(this, '上海')}>上海</li>
                    <li onClick={this.clickHandle.bind(this, '深圳')}>深圳</li>
                    <li onClick={this.clickHandle.bind(this, '海南')}>海南</li>
                    <li onClick={this.clickHandle.bind(this, '南京')}>南京</li>
                    <li onClick={this.clickHandle.bind(this, '四川')}>四川</li>
                    <li onClick={this.clickHandle.bind(this, '长沙')}>长沙</li>
                    <li onClick={this.clickHandle.bind(this, '贵州')}>贵州</li>
                    <li onClick={this.clickHandle.bind(this, '海口')}>海口</li>
                    <li onClick={this.clickHandle.bind(this, '江苏')}>江苏</li>
                    <li onClick={this.clickHandle.bind(this, '徐州')}>徐州</li>
                    <li onClick={this.clickHandle.bind(this, '黑龙')}>黑龙</li>
                </ul>
            </div>
        )
    }
    componentDidMount() {
        
    }
    clickHandle(newCity){
        const changeFn = this.props.changeFn
        changeFn(newCity)
    }
 }

export default CityList